<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<!-- 使用UTF-8 -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<!-- 设置移动终端可视区域 -->
		<meta content="telephone=no" name="format-detection">
		<!-- 禁止iPhone等手机自动将数字变成可点击的拨号连接 -->
		<title>评价</title>
		<link href="css/style.css" type="text/css" rel="stylesheet" />
		<link href="css/weui.css" type="text/css" rel="stylesheet" />
	</head>
	<body style="background: #F6F6F6;">
		<div class="evaluate" id="containerVue" v-cloak>
			<div class="headerView">
				<i onclick="closeView()">&#139;</i>
				<h1>"966588"查询系统</h1>
				<div></div>
			</div>
			<div class="title">{{title}}</div>
			<div class="cont">
				<div class="evaluateText">
					<div class="label">服务质量</div>
					<div class="level clearfix">
						<img v-for="index in 5" :src="[param.serviceAttitude < index?'image/star-f.png':'image/star.png']" alt="" @click="level1(index)">
					</div>
					<span class="text">{{levelVal1}}</span>
				</div>
				<div class="evaluateText">
					<div class="label">服务时效</div>
					<div class="level clearfix">
						<img v-for="index in 5" :src="[param.serviceEfficiency < index?'image/star-f.png':'image/star.png']" alt="" @click="level2(index)">
					</div>
					<span class="text">{{levelVal2}}</span>
				</div>
				<div class="evaluateText">
					<div class="label">服务态度</div>
					<div class="level clearfix">
						<img v-for="index in 5" :src="[param.serviceLevel < index?'image/star-f.png':'image/star.png']" alt="" @click="level3(index)">
					</div>
					<span class="text">{{levelVal3}}</span>
				</div>
				<div class="evaluateText">
					<div class="label">是否按约收费</div>
					<div class="select">
						<input type="radio" name="radio1" value="1" v-model="param.isServiceCharge"><span>是</span>&nbsp;&nbsp;&nbsp;
						<input type="radio" name="radio1" value="0" v-model="param.isServiceCharge"><span>否</span>
					</div>
				</div>
				<div class="evaluateText">
					<div class="label">服务是否规范</div>
					<div class="select">
						<input type="radio" name="radio2" value="1" v-model="param.isServiceSpecification"><span>是</span>&nbsp;&nbsp;&nbsp;
						<input type="radio" name="radio2" value="0" v-model="param.isServiceSpecification"><span>否</span>
					</div>
				</div>
				<div class="evaluateText">
					<div class="label" style="top: .5rem;">情况描述</div>
					<textarea placeholder="您有不满意评价,请您对情况进行描述" v-model="param.description"></textarea>
				</div>
			</div>
			<!-- <div style="height: 6.5rem;"></div> -->
			<div class="btn">
				<div class="serverText" @click="serveBoole = true">评价说明</div>
				<div @click="submit" class="btn_div" v-if="submitOnce == true">提交</div>
				<div class="btn_div" v-if="submitOnce == false" style="background-color: #ccc;">提交</div>
				<div @click="reset" class="btn_div reset">重置</div>
			</div>
			<div class="js_dialog" style="opacity: 1;" v-if="serveBoole">
				<div class="weui-mask"></div>
				<div class="weui-dialog" style="max-width: 20rem;">
					<div class="close" @click="serveBoole = false"><img src="image/close.png" alt=""></div>
					<div class="weui-dialog__hd"><strong class="weui-dialog__title">评价说明</strong></div>
					<div class="weui-dialog__bd">
						（一）服务质量。评价项目服务人员专业水平、服务能力、成果质量。<br><br>
						（二）服务时效。评价项目服务人员是否按合同约定时间完成服务事项、办事效率、响应速度。<br><br>
						（三）服务态度。评价项目服务人员是否一次性告知所需提供的资料、是否及时反馈服务进度和问题、服务人员言行举止是否得当。<br><br>
						（四）服务收费。是否按合同约定价格收取服务费，有无擅自提高收费、增设收费事项行为。<br><br>
						（五）服务规范。是否证（照）齐全，是否在规定的资质范围内承揽业务，是否按操作流程提供标准、规范的服务，是否符合行业政策规定，是否存在弄虚作假行为。
					</div>
				</div>
			</div>
		</div>
		<script src="script/jquery-3.5.js"></script>
		<script src="script/vue.js"></script>
		<script src="script/api.js"></script>
		<script src="script/ajax.js"></script>
		<script>
			var app = new Vue({
				el: '#containerVue',
				data: {
					info: JSON.parse(sessionStorage.getItem('evalInfo')), // 详情信息
					param: {
						projectId: "",
						serviceAttitude: '5',
						serviceEfficiency: '5',
						serviceLevel: '5',
						isServiceCharge: '1',
						isServiceSpecification: '1',
						description: ''
					},// 提交条件
					title: "",
					levelVal1: "非常满意",
					levelVal2: "非常满意",
					levelVal3: "非常满意",
					serveBoole: true,
					submitOnce: true,
				},
				created() {
					this.param.projectId = this.info.id;
					this.title = this.info.name;
				},
				watch: {},
				methods: {
					// 质量评价
					level1(i) {
						this.param.serviceAttitude = i
						if (i == 1) {
							this.levelVal1 = "很差"
						}else if (i == 2) {
							this.levelVal1 = "较差"
						}else if (i == 3) {
							this.levelVal1 = "一般"
						}else if (i == 4) {
							this.levelVal1 = "很满意"
						}else {
							this.levelVal1 = "非常满意"
						}
					},
					// 效率评价
					level2(i) {
						this.param.serviceEfficiency = i
						if (i == 1) {
							this.levelVal2 = "很差"
						}else if (i == 2) {
							this.levelVal2 = "较差"
						}else if (i == 3) {
							this.levelVal2 = "一般"
						}else if (i == 4) {
							this.levelVal2 = "很满意"
						}else {
							this.levelVal2 = "非常满意"
						}
					},
					// 服务评价
					level3(i) {
						this.param.serviceLevel = i
						if (i == 1) {
							this.levelVal3 = "很差"
						}else if (i == 2) {
							this.levelVal3 = "较差"
						}else if (i == 3) {
							this.levelVal3 = "一般"
						}else if (i == 4) {
							this.levelVal3 = "很满意"
						}else {
							this.levelVal3 = "非常满意"
						}
					},
					// 提交评价
					submit() {
						let that = this;
						let param = JSON.stringify(that.param);
						this.submitOnce = false;
						if (that.param.serviceAttitude == 0) {
							return $.Jwarning("请选择服务质量")
						} else if (that.param.serviceEfficiency == 0) {
							return $.Jwarning("请选择服务时效")
						} else if (that.param.serviceLevel == 0) {
							return $.Jwarning("请选择服务态度")
						} else {
							if (that.param.serviceLevel < 3||that.param.serviceEfficiency < 3||that.param.serviceAttitude < 3) {// 满足每项低于3星条件
								if (that.param.description != '') {
									ajaxHttpJson({
										url: 'jeecg-boot/node/nodeProjectEvaluation/add',
										type: 'post',
										data: param,
										success: function(res) {
											that.submitOnce = true;
											if (res.code == '200') {
												$.Jsuccess('提交成功')
												setTimeout(function() {
													window.history.back(-1);
												},3000)
											} else {
												$.Jwarning(res.message)
											}
										}
									})
								} else {
									$.Jwarning("请提出建议和评价，感谢您的参与！")
								}
							} else {// 满足高于2星条件
								ajaxHttpJson({
									url: 'jeecg-boot/node/nodeProjectEvaluation/add',
									type: 'post',
									data: param,
									success: function(res) {
										that.submitOnce = true;
										if (res.code == '200') {
											$.Jsuccess('提交成功')
											setTimeout(function() {
												window.history.back(-1);
											},3000)
										} else {
											$.Jwarning(res.message)
										}
									}
								})
							}
						}
					},
					// 重置
					reset() {
						this.levelVal1 = '';
						this.levelVal2 = '';
						this.levelVal3 = '';
						this.param.serviceAttitude = '0';
						this.param.serviceEfficiency = '0';
						this.param.serviceLevel = '0';
						this.param.isServiceCharge = '0';
						this.param.isServiceSpecification = '0';
						this.param.description = '';
					}
				}
			})
		</script>
	</body>
</html>
